<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>FSR</title>

    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="/static/font-awesome/css/font-awesome.css" rel="stylesheet">
    <link href="/static/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">


    <link href="/static/css/animate.css" rel="stylesheet">
    <link href="/static/css/style.css" rel="stylesheet">

</head>

<body class="gray-bg">

<div class="middle-box text-center loginscreen animated fadeInDown">
    <div>
        <div>

            <h1 class="logo-name">FSR</h1>

        </div>
        <h3>FSR开源运维管理系统设置账户密码</h3>

        <form class="m-t" role="form" id="login_form" method="post">
            {% csrf_token %}
            <div class="form-group">
                <input type="text" class="form-control" placeholder="{{ user_obj.username }}" disabled>
            </div>
            <div class="form-group">
                <input type="password" class="form-control" placeholder="密码" name="password_1">
            </div>
            <div class="form-group">
                <input type="password" class="form-control" placeholder="密码" name="password_2">
            </div>
            <input type="hidden" class="form-control" name="code" value="{{ code }}">
            <button type="submit" class="btn btn-primary block full-width m-b">设置密码</button>
        </form>

        <p class="m-t">
            <small>Copyright FSR © 2021-2021</small>
        </p>
    </div>
</div>

<!-- Mainly scripts -->
<script src="/static/js/jquery-3.1.1.min.js"></script>
<script src="/static/js/bootstrap.js"></script>
<script src="/static/js/plugins/validate/jquery.validate.js"></script>
<script src="/static/js/plugins/validate/messages_zh.js"></script>
<script src="/static/js/plugins/sweetalert/sweetalert.min.js"></script>

<script>
    $(document).ready(function () {
        $("#login_form").validate({
            rules: {
                password_1: {
                    required: true,
                    minlength: 6
                },
                password_2: {
                    required: true,
                    minlength: 6
                }
            },
            submitHandler: function () {
                var str = $('#login_form').serialize();
                $.post('{% url 'user_create_password' %}', str, function (res) {
                    if (res.status == 0) {
                        swal({
                            title: res.msg,
                            type: 'success',
                            confirmButtonText: "OK"
                        }, function () {
                            window.location.href='{% url 'user_login' %}';
                        });
                    } else {
                        swal({
                            title: res.msg,
                            type: 'error',
                            confirmButtonText: "知道了"
                        });
                    }
                });
            }
        });
    });
</script>

</body>

</html>
